<template>
  <div>
    <van-nav-bar title="修改昵称" left-arrow @click-left="onClickLeft" />
    <div class="van">
      <van-notice-bar wrapable :scrollable="false" text="为保护您的隐私，您的昵称将用于社区交流和医患沟通" class="notbar" />
    </div>
    <div class="box">
      <p><input type="text" v-model="val"><img src="../../img/关闭.png" alt="" style="width: 20px;"></p>
      <button class="btn" @click="emit">确认修改</button>
    </div>
  </div>
</template>
<script setup lang="ts">
import {ref} from 'vue'
const val = ref('')
const onClickLeft = () => history.back();
// 点击修改
const emit=()=>{

}
</script>
<style scoped>
.van{
  width: 100%;
  height: 55px;
}
.notbar{
  width: 96%;
  height: 45px;
  line-height: 17px;
  border-radius: 5px;
  margin-left: 2%;
  color: orange;
  font-weight: 600;
  font-size: 14px;
  background-color: rgb(249, 228, 219);
}
.box{
  width: 100%;
  height: 575px;
  background-color: #eae8e8;
}
.box>p>input{
  width: 94%;
  height: 45px;
  border-radius: 5px;
  border: none;
  margin-left: 3%;
  margin-top: 10px;
  position: relative;
}
.box>p>img{
  position: absolute;
  top: 125px;
  right: 30px;
}
.btn{
  width: 94%;
  height: 40px;
  margin-left: 3%;
  margin-top: 50px;
  background-color: rgb(49, 49, 248);
  color: #fff;
  border: none;
  border-radius: 5px;
}
</style>
